
body,h1,h2,h3,h4,h5,h6 {font-family: "Lato", sans-serif;}
body, html {
  height: 100%;
  color: #777;
  line-height: 1.8;
}

/* Create a Parallax Effect */
.bgimg-1, .bgimg-2, .bgimg-3 {
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* First image (Logo. Full height) */
.bgimg-1 {
  background-image: url("download.jpg");
  min-height: 100%;
}

/* Second image (Experiences) */
.bgimg-2 {
  background-image: url("download\ \(1\).jpg");
  min-height: 400px;
}

/* Third image (Education) */
.bgimg-3 {
  background-image: url("download\ \(1\).jpg");
  min-height: 400px;
}
/* Fourth image (Goals) */
.bgimg-4 {
  background-image: url("download\ \(3\).jpg");
  min-height: 400px;
}
/* Fifth image (Family) */
.bgimg-5 {
  background-image: url("download\ \(3\).jpg");
  min-height: 400px;
}
/* Sixth image (Gallery) */
.bgimg-6 {
  background-image: url("download\ \(3\).jpg");
  min-height: 400px;
}
/* Seventh image (Contact) */
.bgimg-7 {
  background-image: url("download\ \(3\).jpg");
  min-height: 400px;
}

.w3-wide {letter-spacing: 10px;}
.w3-hover-opacity {cursor: pointer;}

/* Turn off parallax scrolling for tablets and phones */
@media only screen and (max-device-width: 1600px) {
  .bgimg-1, .bgimg-2, .bgimg-3 {
    background-attachment: scroll;
    min-height: 400px;
  }
}


body 
  svg {
    font-family: 'Russo One', sans-serif;
    position: absolute; 
    width: 100%; height: 100%;
  }
  svg text {
    text-transform: uppercase;
    animation: stroke 5s infinite alternate;
    stroke-width: 2;
    stroke: #365fa0;
    font-size: 75px;
  }
  @keyframes stroke {
    0%   {
      fill: rgba(72,138,20,0); stroke: rgba(54,95,160,1);
      stroke-dashoffset: 25%; stroke-dasharray: 0 50%; stroke-width: 2;
    }
    70%  {fill: rgba(72,138,20,0); stroke: rgba(54,95,160,1); }
    80%  {fill: rgba(72,138,20,0); stroke: rgba(54,95,160,1); stroke-width: 3; }
    100% {
      fill: rgba(72,138,204,1); stroke: rgba(54,95,160,0); 
      stroke-dashoffset: -25%; stroke-dasharray: 50% 0; stroke-width: 0;
    }
  }

  video{
    position: absolute;
    width: 200px;
    height: 400px;
    margin-left: 750px;
    margin-top: -36%;
  }


  .mySlides {display:none}
  .w3-left, .w3-right, .w3-badge {cursor:pointer}
  .w3-badge {height:13px;width:13px;padding:0}

  #audio{
    margin-left: 60%;
    margin-top: -10%;
  }

  
